axios通过pdf下载地址预览pdf |
您所在的位置：网站首页 › js 文件下载与预览的区别是什么 › axios通过pdf下载地址预览pdf |
|
前言
最近做一个功能，根据一个pdf的下载地址，做出既能下载又能预览pdf的两个功能按钮，因为地址本身在浏览器中打开就能下载，直接记录怎么实现预览功能。 具体步骤1.前台html代码 2.前台js代码 axios({ method: 'get', url:'/preview', params:{ pdfUrl:'https://xxxx/xxx/xxx.pdf' }, responseType: 'blob', }).then(function (response) { let blob = new Blob([response.data], { type: response.data.type }) let url = URL.createObjectURL(blob) document.getElementById('iframe').src = url }).catch(err => { });3.后台代码 @RequestMapping("/preview") public void preview(HttpServletResponse response, String pdfUrl) { response.setContentType("application/pdf"); try(OutputStream out = response.getOutputStream(); InputStream in = new BufferedInputStream(new URL(pdfUrl).openConnection().getInputStream())) { byte[] b = new byte[1024]; int len = 0; while ((len = in.read(b))!=-1) { out.write(b,0,len); } out.flush(); } catch (Exception e) { System.out.println(e); } } 后记实现办法还有用pdf.js，因为不想在vue中添加依赖，没有采用。 |
今日新闻 |
推荐新闻 |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |